<!-- 模块说明 -->

<template>
  <div>
    <TableSimple :columns="columns" :data="data" :pagination="{localPage:true}" />
  </div>
</template>

<script setup>
import TableSimple from '@/components/Tables/TableSimple.vue'
const data = [
  {
    name: '张三',
    age: 18,
    status: true
  },
  {
    name: '李四',
    age: 30,
    status: false
  }
]
const   columns = [
  {
    title: '序号',
    type: 'index',
    width: '60'
  },
  {
    title: '姓名',
    dataIndex: 'name'
  },
  {
    title: '年龄',
    dataIndex: 'age'
  },
  {
    title: '状态',
    render: [
      {
        isName: 'span',
        text: (row) => {
          return row.status ? '正常' : '禁用'
        }
      }
    ]
  },
  {
    title: '操作',
    render: [//isName支持接收组件
      {
        isName: 'el-button',
        type: 'text',
        text: '修改',
        click(row) {
          console.log(row, 'row')
        }
      },
      {
        isName: 'el-button',
        type: 'success',
        text: '修改',
        click(row) {
          console.log(row, 'row')
        }
      }
    ]
  }
]
</script>
<style lang="scss" scoped>

</style>